import Other from "./other"
import {createContext} from 'react'
import { useState } from "react"

// import xx from '../../assets/logo.svg'

type themeContext = {
    color: string
}
type themeContent = {
    text: string
}

// 一个context
export let theme = createContext<themeContext>({color:'deepskyblue'})
// 两个context
export let content = createContext<themeContent>({text:'react从入门到精通'})
const UseContextCom = ()=>{
    let [themeColor,setThemeColor] = useState<themeContext>({color:'purple'})

    setTimeout(() => {
        setThemeColor({color:'skyblue'})
    }, 2000);
    return(
        <fieldset>
            <legend>UseContext</legend>
            <theme.Provider value={themeColor}>
                <content.Provider value={{text:'vue3从入门到精通'}}>
                    <Other />
                </content.Provider>
            </theme.Provider>
        </fieldset>
    )
}

export default UseContextCom